import Vue from 'vue'
import VueRouter from 'vue-router'

Vue.use(VueRouter)

const routes = [
  {
    path: '/',
    redirect: '/home'
  },
  {
    path: '/user-view',
    name: 'User',
    redirect: '/login',
    component: () => import('views/User/index.vue'),
    children: [
      {
        path: '/login',
        name: 'Login',
        component: () => import('views/User/Login.vue')
      },
      {
        path: '/register',
        name: 'Register',
        component: () => import('views/User/Register.vue')
      },
    ]
  },
  {
    path: '/home',
    name: 'Home',
    redirect: '/welcome',
    component: () => import('views/Home/index.vue'),
    children: [
      {
        path: '/welcome',
        name: 'Welcome',
        component: () => import('components/common/Welcome.vue')
      },
      {
        path: '/goods-list',
        name: 'goodsList',
        component: () => import('components/content/Goods/GoodsList.vue')
      },
      {
        path: '/cate',
        name: 'Cate',
        component: () => import('components/content/Goods/Cate.vue')
      },
      {
        path: '/params',
        name: 'Params',
        component: () => import('components/content/Goods/Params.vue')
      },
      {
        path: '/users',
        name: 'Users',
        component: () => import('components/content/User/Users.vue')
      },
      {
        path: '/rights',
        name: 'Rights',
        component: () => import('components/content/Power/Rights.vue')
      },
      {
        path: '/roles',
        name: 'RightsList',
        component: () => import('components/content/Power/Roles.vue')
      },
    ]
  },
  
  // ------------ 路由嵌套模块 -------------
  // {
  //   path: '/user',
  //   redirect: '/user/login',
  //   name: 'User',
  //   component: () => import('views/User/index.vue'),
  //   children: [
  //     {
  //       path: 'login',
  //       name: 'Login',
  //       component: () => import('views/User/Login.vue')
  //     },
  //     {
  //       path: 'register',
  //       name: 'Register',
  //       component: () => import('views/User/Register.vue')
  //     },
  //   ]
  // },
  {
    path: '/upload-img',
    name: 'UploadImg',
    component: () => import('views/ImgUpload/Upload-img.vue')
  },
  {
    path: '/about',
    name: 'About',
    // route level code-splitting
    // this generates a separate chunk (about.[hash].js) for this route
    // which is lazy-loaded when the route is visited.
    component: () => import(/* webpackChunkName: "about" */ 'views/About.vue')
  },
  {
    path: '/profile',
    name: 'Profile',
    component: () => import('views/Profile.vue')
  }
]

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes
})

// 挂载路由导航守卫
// router.beforeEach((to, from, next) => {
//   // to 表示将要访问的路径
//   // from 表示从哪个路径跳转而来
//   // next 是一个函数。 表示 放行 
//   //      next('/login')  表示强制跳转到 /login 路径

//   if (to.path === '/login') return next();

//   // 获取 token
//   const token = window.sessionStorage.getItem('token');
//   // 验证 token 
//   if (!token) return next('/login');
//   next();
// })

export default router
